<template>
  <el-dialog :model-value="visible" title="员工合规情况" width="40%" @close="cancel" :z-index="9">
    <div class="boardBox">
      <div>员工姓名：{{ fxinfo.name }}</div>
      <el-table
        :data="list"
        border
        class="mt10"
        v-loading="loading"
        element-loading-background="rgba(0, 0, 0, 0.5)"
        element-loading-text="加载中..."
        style="max-height: 400px; overflow-y: scroll; overflow-x: hidden"
      >
        <el-table-column label="风险点" align="center" key="risk_name" prop="risk_name" />
        <el-table-column label="风险描述" align="center" key="risk_desc" prop="risk_desc" />
        <el-table-column label="操作" align="center">
          <template #default="scope">
            <el-button class="selfColor" text icon="View" @click="godetail(scope.row)" v-if="scope.row.button==2">查看</el-button>
            <el-button class="selfColor" text icon="Edit" @click="godetail1(scope.row)" v-else>处理</el-button>
          </template>


        </el-table-column>
      </el-table>
    </div>
  </el-dialog>
</template>
<script setup lang="ts">
  import { ref, reactive, watch } from "@/TUIKit/adapter-vue";
  import { risk_list } from "@/api/cf";

  const props = defineProps({
    visible: {
      type: Boolean,
      default: false,
    },
    fxinfo: {
      type: Object,
      default: "",
    },
  });
  import { useRouter } from "vue-router";
  const router = useRouter();
  const list = ref([{ fengxian: "wq ", content: "1ssssss" }]);

  const emit = defineEmits<{ (event: "update:visible", value: boolean): void; (event: "chananniu", value: ""): void }>();
  // 获取表单引用
  const queryForm = ref(null);
  // 监听 localValue 的变化，通知父组件更新值
  watch(
    () => props.visible,
    newValue => {
      if (newValue) {
        if (props.fxinfo) {
          risk_list({ id: props.fxinfo.id }).then(res => {
            list.value = res.data;
          });
        }
      }
    }
  );

  const addvisible = ref(false);

  function handleChange(value) {
    selectedArrRef.value.togglePopperVisible();
  }

  function cancel() {
    emit("update:visible", false);
    emit("chananniu", "");
  }

  function godetail(row) {
    emit("update:visible", false);
    emit("chananniu", "");
    router.push({ name: "employeeInfo", params: { id: row.info_id, name:row.type,status:0 } });
  }

  function godetail1(row) {
    emit("update:visible", false);
    emit("chananniu", "");
    router.push({ name: "employeeInfo", params: { id: row.info_id, name:row.type,status:1 } });
  }
</script>

<style lang="scss" scoped>
.boardBox {
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-around;
  overflow-y: scroll;
  height: 100%;

  &::-webkit-scrollbar {
    display: none;
  }

  -ms-overflow-style: none;
  scrollbar-width: none;

  .tishi {
    font-size: 14px;
    color: #999;
    background-color: #f3f8fb;
    padding: 5px 10px;
    border-radius: 6px;
  }
}
</style>
